//加载模块
layui.use(function(){ //亦可加载特定模块：layui.use(['layer', 'laydate', function(){
    //得到各种内置组件
    var layer = layui.layer //弹层
        ,laypage = layui.laypage //分页
        ,laydate = layui.laydate //日期
        ,table = layui.table //表格
        , $ = layui.jquery//传值

    // //向世界问个好
     layer.msg('欢迎进入学生信息表');

    /*此时访问获取数据会出现error的错误，那是因为我们没有配置json数据解析器fastjson*/
    //执行一个 table 实例
    table.render({
        elem: '#student'
        ,height: 580
        ,url: '/stu/findByPage' //数据接口
        ,title: '学生信息表'
        ,page: true//开启分页
        ,toolbar: 'default' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
        ,totalRow: true //开启合计行
        ,cols: [[ //表头
            {type: 'checkbox', fixed: 'left'}
            ,{field: 'sid',align:'center', title: '学生编号',width:100,unresize:true}
            ,{field: 'sname',align:'center', title: '学生姓名',width:190,unresize:true,edit:'text'}
            ,{field:'loginName',align:'center',title:'登录名',width:150,unresize:true,edit:"text"}
            ,{field: 'loginPwd', align:'center',title: '登录密码',width:120,unresize:true,edit:"text"}
            ,{field: 'scollege', align:'center',title: '所属院校',width:250,unresize:true,edit:"text"}
            ,{field: 'sclass',align:'center', title: '所属班级',width:190,unresize:true,edit:"text"}
            ,{field: 'smajor',align:'center',title:'专业',width:190,unresize:true,edit:"text"}
            ,{fixed: 'right', align:'center',unresize:true, toolbar: '#barDemo',width:270}
        ]]
    });

    //监听头工具栏事件
    table.on('toolbar(studenlist)', function(obj){
        var checkStatus = table.checkStatus(obj.config.id)
            ,data = checkStatus.data; //获取选中的数据
        switch(obj.event){
            case 'add':
                //content:no是表示不需要在弹出层中出现滚动条动画
                layer.open({
                    type:2,
                    content:'add_teacher.html',
                    area:['50%','80%']
                })
                layer.msg('添加');
                break;
            case 'update':
                if(data.length === 0){
                    layer.msg('请选择一行');
                } else if(data.length > 1){
                    layer.msg('只能同时编辑一个');
                }
                break;
            case 'delete':
                if(data.length === 0){
                    layer.msg('请选择一行');
                } else {
                    //首先，定义一个空数组来存储所选数据的id
                    var data_id=[];
                    //获取所选数据的id，传回后端进行数据删除
                    for (var i = 0;i<data.length;i++){
                        data_id.push(data[i].mId);
                        console.log(data)
                    }
                    //ajax将数据传回后端后，执行批量删除
                    $.ajax({
                        type:'post',
                        url:'mc/delAll',
                        traditional:true,
                        data: {
                            //此处的mIds必须与后台mapper的参数名一致，否则传不了
                            mIds:data_id
                            //注：此处传到后端的id一定是null，因为前端向后端传值的时候传数组是直接传不过去，
                            // 1.加上字符串，那就一定能穿成功,2.设置traditional为true
                        },//传递数据id
                        success:function (res) {
                            layer.msg(res.msg, {//res:后端返回的结果
                                time: 1000//两秒后执行以下操作
                            } ,function () {
                                //刷新当前页
                                window.location.reload()
                            })
                        }
                    })
                }
                break;
        };
    });
    //触发编辑事件
    table.on('edit(studentlist)', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"
        if (obj.value!=null && obj.value!='') {
            $.ajax({
                url:'/mc/update',
                type:'post',
                traditional:true,//此行代表传递数组，如果没有向后端传递数组，则可以去掉
                data:{
                    value:obj.value,//对象内容
                    mIds:obj.data.mId//对象id
                },
                success:function (res) {
                    layer.msg(res.msg);
                }
            })
        }else {
            layer.msg("所编辑的内容不能为空哦！",{
                time:1000//设置刷新表格的时间
            },function () {
                window.location.reload();//刷新当前表格
            })
        }
    });

    //行工具条事件
    table.on('tool(studentlist)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
        var data = obj.data; //获得当前行数据
        var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）

        if(layEvent === 'detail'){ //查看
            //携带数据跳转即可
            window.location.href="mc/select?mIds="+obj.data.mId;
        } else if(layEvent === 'del'){ //删除
            console.log(obj.data);
            layer.confirm('真的删除行么', function(index){
                $.ajax({
                    url:'mc/deleteOne',
                    type:'post',
                    data:{
                    mIds:obj.data.mId//所点击行的id
                    }
                ,success:function (res) {
                      layer.msg(res.msg)
                    }
                })
                obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                layer.close(index);
                //向服务端发送删除指令
            });
        } else if(layEvent === 'edit'){ //编辑
            //do something

            //同步更新缓存对应的值
            obj.update({
                username: data.sname
                ,title: 'xxx'
            });
        } else if(layEvent === 'LAYTABLE_TIPS'){
            layer.alert('Hi，头部工具栏扩展的右侧图标。');
        }
    });

})